<template>
	<view class="lookpay">
		<!-- #ifdef APP-PLUS -->
		<Hearder :name="'查看收款码'"></Hearder>
		<!-- #endif -->
		<image :src="imgurl" mode="widthFix" v-if="imgurl"></image>
		<view class="nidata" v-if="!imgurl">
			<image src="../../static/images/noimg.png"></image>
		</view>
		<!-- #ifdef H5 -->
		<view class="submit">点击图片保存</view>
		<!-- #endif -->
		<!-- #ifdef APP-PLUS -->
		<view class="submit" @click="saveImage">保存到手机</view>
		<!-- #endif -->
	</view>
</template>

<script>
	export default {
		data(){
			return{
				imgurl:''
			}
		},
		onLoad(options) {
			this.imgurl = options.imgurl
		},
		methods:{
			saveImage(){
				uni.showLoading({
					title: '正在保存'
				});
				uni.saveImageToPhotosAlbum({
					filePath: this.imgurl,
					success: function () {
						uni.showToast({
							title: '图片保存成功～'
						});
					},
					fail: function (e) {
						if (e.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || e.errMsg === "saveImageToPhotosAlbum:fail auth deny") {
						  // 这边微信做过调整，必须要在按钮中触发，因此需要在弹框回调中进行调用
						  wx.showModal({
							title: '提示',
							content: '需要您授权保存相册',
							showCancel: false,
							success:modalSuccess=>{
							  wx.openSetting({
								success(settingdata) {
								  if (settingdata.authSetting['scope.writePhotosAlbum']) {
									wx.showModal({
									  title: '提示',
									  content: '获取权限成功,再次点击图片即可保存',
									  showCancel: false,
									})
								  } else {
									wx.showModal({
									  title: '提示',
									  content: '获取权限失败，将无法保存到相册哦~',
									  showCancel: false,
									})
								  }
								},
								fail(failData) {
								  console.log("failData",failData)
								},
								complete(finishData) {
								  console.log("finishData", finishData)
								}
							  })
							}
						  })
						}
					},
					complete: function (){
						uni.hideLoading()
					}
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.lookpay{
		/deep/.fixedhead .head{
			border-bottom: 15rpx solid #f7f6f6;
			height: auto;
		}
		>image{
			width: 88%;
			margin: 100rpx 6%;
		}
		.submit{
			position: fixed;
			bottom: 0;
			width: 100%;
			height: 98rpx;
			background: $uni-item-color;
			color: #fff;
			text-align: center;
			line-height: 98rpx;
			font-size: 32rpx;
		}
	}
</style>
